<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>jQuery手机端瀑布流布局代码 - 站长素材</title>
<link rel="stylesheet" type="text/css" href="css/base.css"/>

<link rel="stylesheet" type="text/css" href="css/style.css"/> 

<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>

</head>
<body>

<div class="wrapper">
	<ul class="wall">
		<li class="article">
			<a href="http://sc.chinaz.com/">
				<img src="images/7.jpg" />
			<p>用户名用户名用户名用户名用户名</p>
				<small>10000000票</small>
				<input type="button" value="投票" />
			</a>
		</li>
		<li class="article">
			<a href="http://sc.chinaz.com/">
				<img src="images/12.jpg" />
				<p>用户名用户名用户名用户名</p>
				<small>10000000票</small>
				<input type="button" value="投票" />
			</a>
		</li>
		<li class="article">
			<a href="http://sc.chinaz.com/">
				<img src="images/4.jpg" />
				<p>用户名用户名用户名用户名用户名</p>
				<small>10000000票</small>
				<input type="button" value="投票" />
			</a>
		</li>
		<li class="article">
			<a href="http://sc.chinaz.com/">
				<img src="images/6.jpg" />
				<p>用户名用户名用户名用户名用户名</p>
				<small>10000000票</small>
				<input type="button" value="投票" />
			</a>
		</li>
	</ul>
</div>

<script src="js/jaliswall.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function(){
		$('.wall').jaliswall({ item: '.article' });
	});
</script>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
<p>来源：<a href="http://sc.chinaz.com/" target="_blank">站长素材</a></p>
</div>
</body>
</html>